import Vue from 'vue'
import Router from 'vue-router'
//import ShoppingCart from '@/page/shoppingCart'
import ElmentForm from '@/page/elmentForm'
import RouterDemo from '@/page/routerDemo'
import RouterDemo02 from '@/page/routerDemo02'
import RouterDemo03 from '@/page/routerDemo03'

//安装路由到vue
Vue.use(Router);

const routes = [{
    path: '/',
    redirect: '/ShoppingCart'
  }, {
    path: '/ShoppingCart/:id',
    //页面可以直接用props接收id参数
    props: true,
    name: 'ShoppingCart',
    //异步按需加载，当进入此路由，此路由的资源才会加载（懒加载）
    component: () => import('@/page/ShoppingCart')
  },
  {
    path: '/ElmentForm',
    name: 'ElmentForm',
    beforeEnter: (to, from, next) => {
      console.log('路由before enter');
      next()
    },
    component: ElmentForm
  },

  {
    path: '/RouterDemo',
    name: 'RouterDemo',
    component: RouterDemo,
    children: [{
      path: 'RouterDemo02',
      name: 'RouterDemo02',
      //多router-view
      components: {
        default: RouterDemo02,
        david: RouterDemo03
      },
    }]
  },
  {
    path: '/vuex',
    name: 'Vue',
    component: () => import('@/page/vuex')
  }
]

export default new Router({
  mode: 'history',
  routes
})
